<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" >
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta charset="utf-8">


	<title>主界面</title>


	<!-- Bootstrap -->
	<link rel="stylesheet" href="/static/css/buttons.css">
	<link href="/static/css/stylesheets.css" rel="stylesheet" type="text/css" />
	<link href="/static/css/bootstrap.min.css" rel="stylesheet" media="screen">
	<link href="/static/css/style_admin.css" rel="stylesheet" type="text/css">
	<link type="text/css" rel="stylesheet" media="all" href="/static/css/global.css" />
	<link type="text/css" rel="stylesheet" media="all" href="/static/css/global_color.css" />
	<link rel="stylesheet" href="/static/css/buttons.css">
	<link href="http://cdn.bootcss.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
	<!--[endif]-->
	<script src="/static/js/jquery-1.9.1.min.js"></script>
	<script src="/static/js/bootstrap.min.js"></script>
	<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
	<!--[if lt IE 9]>
	<script src="/static/js/html5shiv.js"></script>
	<script src="/static/js/respond.min.js"></script>
	<![endif]-->
	<!-- Javascript -->
	<!--动态添加接入设备的电量信息-->
	<script>
        <!--动态添加设备电量标识-->
        <!--json取新接入设备数据-->
        var dataupdate;

        var lowpower_devices={'Devices':{},'devices_num':0};
        function sortbycap(a,b)
        {
            return a.Device.PowerEnenge - b.Device.PowerEnenge
        }
        dataupdate = function(){

            $.getJSON('http://'+window.location.host+'/admin/api/get_devices_list/{{.UserID}}', function(data) {
                //console.log(data.sort(sortbycap))
                // vardevices = data.sort(sortbycap);
                <!--$("#clearfix").empty();-->
                $("#devices_num").text((data.length));
                lowpower_devices={'Devices':{},'devices_num':0};
                $.each(data.sort(sortbycap),function(index,element){

                    if (typeof($("#"+element.Device.DeviceID).attr("id")) == "undefined"  && (element.Device.DeviceID != "")){

                        $("#table_power").append('<tr id="power_tr'+element.Device.DeviceID+'"><td id="power'+element.Device.DeviceID+'"></td><td id="'+element.Device.DeviceID+'" style="text-align:center;">'+element.Bed.Department_.Name+'</td><td id="'+element.Device.DeviceID+'" style="text-align:center;">'+element.Bed.Room_.RoomNum+'房'+'&nbsp;&nbsp;'+element.Bed.BedNum+'号</td></tr>');

						var power = document.getElementById("power'+element.Device.DeviceID+'");
                        var Power = element.Device.PowerEnenge
                        var device = $("#power"+element.Device.DeviceID)

                        if(Power >=80) {
                            <!--$("#power").append("<div class='power100'></div>");-->
                            device.addClass('power100')
                        } else if (Power >= 60 && Power<80) {
                            <!--$("#power").append("<div class='power80'></div>");-->
                             device.addClass('power80')
                        } else if (Power >= 40 && Power <60) {
                            <!--$("#power").append("<div class='power60'></div>");-->
                            device.addClass('power60')
                        } else if (Power >= 20 && Power <40) {
                            <!--$("#power").append("<div class='power40'></div>");-->
                            device.addClass('power40')
                        } else if (Power <= 20) {
                            <!--$("#power").append("<div class='power20'></div>");-->
                            device.addClass('power20')
                        }
                    }else{
                    }
                });

            });
            <!--setTimeout(function() {-->
                <!--dataupdate();-->
            <!--},10000);-->
        };
        setTimeout(function() {
            dataupdate();
        },100);

    </script>



	<script language="javascript" type="text/javascript">
    //获取床位数据
    $(document).ready(function(){
        $(".btn_delete").click(function () {
            $.post("/bed/del_bed/{{.UserID}}", {
                Id: $(".btn_delete").attr("Name"),
                BedNum: "",
                Room: 0,
                Department:0
            }, function (result) {
                //console.log(result)
                if(result.RespCode == 200){
                    alert("删除成功");
                    location.reload();
                }
            });
        });

//        $(".btn_modify").click(function () {
//            location.href = "/department/update_department/"+$(".btn_delete").attr("Name");
//        });
    });

        //显示角色详细信息
        function showDetail(flag, a) {
            var detailDiv = a.parentNode.getElementsByTagName("div")[0];
            if (flag) {
                detailDiv.style.display = "block";
            }
            else
                detailDiv.style.display = "none";
        }

        //删除
        function deleteAdmin() {
            var r = window.confirm("确定要删除此床位吗？");
            document.getElementById("operate_result_info").style.display = "block";
        }
        //全选
        function selectAdmins(inputObj) {
            var inputArray = document.getElementById("datalist").getElementsByTagName("input");
            for (var i = 1; i < inputArray.length; i++) {
                if (inputArray[i].type == "checkbox") {
                    inputArray[i].checked = inputObj.checked;
                }
            }
        }
    </script>

</head>
<body>

<div class="header">
	<div class="logo">液位检测监控系统</div>

</div>

<div class="menu">

	<div class="breadLine">
		<div class="adminControl active">
			你好,{{.admin.UserName}}
		</div>
	</div>

	<ul class="navigation">
		<li class="active">
			<a href="/admin/show_admin_index/{{.UserID}}">
				<span class="isw-bookmark" style="margin-top:5px;"></span>
				<span class="text">主界面</span>
			</a>
		</li>
		<li>
			<a  class="a-alert test" href="/admin/show_admins_list/{{.UserID}}">
				<span class="isw-user" style="margin-top:5px;"></span>
				<span class="text">用户数据库</span>
			</a>
		</li>
		<li>
			<a href="/admin/show_beds_list/{{.UserID}}">
				<span class="isw-documents" style="margin-top:5px;"></span>
				<span class="text">床位数据库</span>
			</a>
		</li>
		<li>
			<a href="/admin/show_rooms_list/{{.UserID}}">
				<span class="isw-list" style="margin-top:5px;"></span>
				<span class="text">房间数据库</span>
			</a>
		</li>
		<li>
			<a href="/admin/show_departments_list/{{.UserID}}">
				<span class="isw-text-document" style="margin-top:5px;"></span>
				<span class="text">部门数据库</span>
			</a>
		</li>
		<li>
			<a href="/admin/index/{{.UserID}}">
				<span class="isw-graph" style="margin-top:5px;"></span>
				<span class="text">监控页面</span>
			</a>
		</li>
		<li>
			<a href="/admin/logout/{{.UserID}}">
				<span class="isw-cancel" style="margin-top:5px;"></span>
				<span class="text">退出系统</span>
			</a>
		</li>
	</ul>

	<div class="dr"><span></span></div>

	<div class="widget-fluid">
		<div id="menuDatepicker"></div>
	</div>

	<div class="dr"><span></span></div>

	<div class="widget-fluid">

		<div class="wBlock clearfix">
			<div class="dSpace">
				<h3>Last visits</h3>
				<span class="number">6,302</span>
				<span>5,774 <b>unique</b></span>
				<span>3,512 <b>returning</b></span>
			</div>
			<div class="rSpace">
				<h3>Today</h3>
				<span class="mChartBar" sparkType="bar" sparkBarColor="white"></span>
				<span>&nbsp;</span>
				<span>65% <b>New</b></span>
				<span>35% <b>Returning</b></span>
			</div>
		</div>

	</div>

</div>
		<div class="main">
			<div class="pad20">
				<!--postion start-->
				<div class="postion " style="margin-left:20px;">
					<button  class="button button-glow button-rounded button-raised button-primary" id="broadcast_btn" /><p style="font-size:15px;">广播</p></button>
					<div class="pos-link mart20"><a href="/">主界面</a>  >  <a href="#">部门1</a></div>
				</div>
				<!--postion end-->


				<!--sales-list start-->
				<div class="sales-list row mart20">
					<div class="col-sm-9" style="width:100%;">
						<div class="pad20 bgf">
							<!-- Nav tabs -->
							<div class="tit1 clear">
								<span class="left txt-left txt-blue"><i class="ico i-rank"></i>在线管理员</span>

							</div>
							<div class="tab">
								<ul class="nav nav-tabs sale-tabs" role="tablist">
									<li class="active"><a href="#tab0"  role="tab" data-toggle="tab">全院情况</a></li>
									<li><a href="#tab1"  role="tab" data-toggle="tab">部门1</a></li>
									<li><a href="#tab2"  role="tab" data-toggle="tab">部门2</a></li>
									<li><a href="#tab3"  role="tab" data-toggle="tab">部门3</a></li>
									<li><a href="#tab4"  role="tab" data-toggle="tab">部门4</a></li>
									<li><a href="#tab5"  role="tab" data-toggle="tab">部门5</a></li>
								</ul>
								<!-- Tab panes -->
								<div class="tab-content">
									<!--tab0-->
									<div role="tabpanel" class="tab-pane active" id="tab0">
										<div class="table-responsive mart20 sale-table">
											<table class="table table-bordered table-striped" id="table_power" style="width:1000px;">
												<tr>
													<td style="width:200px; text-align:center;">当前电量</td>
													<td style="width:400px; text-align:center;">所在部门</td>
													<td style="width:400px; text-align:center;">设备位置</td>
													<!--<td>操作</td>-->
												</tr>
												{{range .beds}}
												<tr>
													<!--<td><span class="txt-red" id="power"></span></td>-->
													<td id="power"></td>
													<td>{{.Department_.Name}}</td>
													<td>{{.RoomNum}} &nbsp;{{.BedNum}}</td>
												</tr>
												{{end}}
											</table>
										</div>
									</div>
									<!--tab1-->
									<div role="tabpanel" class="tab-pane" id="tab1">
										<div class="table-responsive mart20 sale-table">
											<table class="table table-bordered table-striped">
												<tr>
													<td width="15%">用户名</td>
													<td width="15%">工号</td>
													<td width="15%">科室</td>
													<td width="25%">在线</td>
													<td width="20%">在线时长</td>
													<td>操作</td>
												</tr>
												{{range .admins}}

												<tr>
													<td><span class="txt-red">{{.UserName}}</span></td>
													<td><a href="#">{{.JobID}}</a></td>
													<td>{{.Department.Name}}</td>
													<td>3000</td>
													<td>45000，000</td>
													<td><a href="#">空</a></td>
												</tr>
												{{end}}

											</table>
										</div>
									</div>
									<!--tab2-->
									<div role="tabpanel" class="tab-pane" id="tab2">
										<div class="table-responsive mart20 sale-table">
											<table class="table table-bordered table-striped">
												<tr>
													<td width="15%">用户名</td>
													<td width="15%">工号</td>
													<td width="15%">科室</td>
													<td width="25%">在线</td>
													<td width="20%">在线时长</td>
													<td>操作</td>
												</tr>

											</table>
										</div>
									</div>
									<!--tab3-->
									<div role="tabpanel" class="tab-pane" id="tab3">
										<div class="table-responsive mart20 sale-table">
											<table class="table table-bordered table-striped">
												<tr>
													<td width="15%">用户名</td>
													<td width="15%">工号</td>
													<td width="15%">科室</td>
													<td width="25%">在线</td>
													<td width="20%">在线时长</td>
													<td>操作</td>
												</tr>
												{{range .admins}}

												<tr>
													<td><span class="txt-red">{{.UserName}}</span></td>
													<td><a href="#">{{.JobID}}</a></td>
													<td>{{.Department.Name}}</td>
													<td>3000</td>
													<td>45000，000</td>
													<td><a href="#">查看详情</a></td>
												</tr>
												{{end}}

											</table>
										</div>
									</div>
									<!--tab4-->
									<div role="tabpanel" class="tab-pane" id="tab4">
										<div class="table-responsive mart20 sale-table">
											<table class="table table-bordered table-striped">
												<tr>
													<td width="15%">用户名</td>
													<td width="15%">工号</td>
													<td width="15%">科室</td>
													<td width="25%">在线</td>
													<td width="20%">在线时长</td>
													<td>操作</td>
												</tr>
												{{range .admins}}

												<tr>
													<td><span class="txt-red">{{.UserName}}</span></td>
													<td><a href="#">{{.JobID}}</a></td>
													<td>{{.Department.Name}}</td>
													<td>3000</td>
													<td>45000，000</td>
													<td><a href="#">查看详情</a></td>
												</tr>
												{{end}}

											</table>
										</div>
									</div>
									<!--tab5-->
									<div role="tabpanel" class="tab-pane" id="tab5">
										<div class="table-responsive mart20 sale-table">
											<table class="table table-bordered table-striped">
												<tr>
													<td width="15%">用户名</td>
													<td width="15%">工号</td>
													<td width="15%">科室</td>
													<td width="25%">在线</td>
													<td width="20%">在线时长</td>
													<td>操作</td>
												</tr>
												{{range .admins}}

												<tr>
													<td><span class="txt-red">{{.UserName}}</span></td>
													<td><a href="#">{{.JobID}}</a></td>
													<td>{{.Department.Name}}</td>
													<td>是</td>
													<td>45000，000</td>
													<td><a href="#">空</a></td>
												</tr>
												{{end}}

											</table>
										</div>
									</div>

								</div>
							</div>
						</div>
					</div>
				</div>
				<!--sales-list end-->
			</div>
		</div>



<script language="javascript" type="text/javascript">
		//广播
		$(document).ready(function(){
			$("#broadcast_btn").click(function () {
				$.post("/admin/api/broadcast_ip", {
					RespCode: 0,
                    OpCode: 1,
					Msg: ""
				}, function (result) {
					//console.log(result)
					if(result.RespCode == 200){
						alert("广播成功");
					}else{
						alert("广播失败");

					}
				});
			});

//        $(".btn_modify").click(function () {
//            location.href = "/room/update_room/"+$(".btn_delete").attr("Name");
//        });
		});
	</script>

<!-- Javascript -->

</body>
</html>
